<template>
  <div class="ykcolor-primary">
    <div class="ykcolor-primary-left">
      <h4>浅色主题</h4>
      <div class="ykcolor-group">
        <ColorCard label="pcolor-light" color="#2B5AED" />
        <ColorCard label="lcolor-light" color="#1890FF" />
        <ColorCard label="scolor-light" color="#1FB4A2" />
        <ColorCard label="wcolor-light" color="#F5AC08" />
        <ColorCard label="ecolor-light" color="#FA5247" />
        <ColorCard
          label="gray"
          color="#1E2025"
          style="border: 1px solid #444"
        />
      </div>
    </div>
    <div class="ykcolor-primary-right">
      <h4>深色主题</h4>
      <div class="ykcolor-group">
        <ColorCard label="pcolor-dark" color="#3575F6" />
        <ColorCard label="lcolor-dark" color="#308CE1" />
        <ColorCard label="scolor-dark" color="#3DC799" />
        <ColorCard label="wcolor-dark" color="#FBAD3B" />
        <ColorCard label="ecolor-dark" color="#DF4D43" />
        <ColorCard label="white" color="#FFFFFF" class="white" />
      </div>
    </div>
  </div>
</template>
